“Organze” Documentation by “ThemeEaster” v1.0


“Organze”

Updated: 28/05/2025
By: ThemeEaster


Thank you for purchasing our theme. If you have any questions that are beyond the scope of this help file, please contact our support. Thanks so much!


Table of Contents

  1. HTML Structure
  2. Template Components
  3. CSS Files and Structure
  4. JavaScript
  5. Sources and Credits

A) HTML Structure - top

Below is the general HTML structure of the landing page.

1) index.html File Structure - top

The template page's layout consist of top that show the logo and main menu, hero section that show background image, beforecontent that show some amaizing content, about section contain about your some info & feature, service section contained all services, work section you can showcase your portfolio with awesome animation, skills section here you can add some skills, team section is for your team members, testimonial section here you can published your customer reviews, call to action this for call to action content, contact section here you can put your contact information & footer that show copyright information.

<!doctype html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang=""> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8" lang=""> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9" lang=""> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <meta name="description" content="Organic food & farming html project">
        <meta name="author" content="teamXcel">
       
        <title>OrganZe | Organic food & farming html project</title>
        
        <link rel="shortcut icon" type="image/x-icon" href="img/favicon.png">
        
        <!-- Font Awesome CSS -->
        <link rel="stylesheet" href="css/fontawesome.min.css">
        <!-- Themify Icons CSS -->
        <link rel="stylesheet" href="css/themify-icons.css">
        <!-- Elegant Icons CSS -->
        <link rel="stylesheet" href="css/elegant-font-icons.css">
        <!-- Flat Icons CSS -->
        <link rel="stylesheet" href="css/food-icon.css">
        <!-- animate CSS -->
        <link rel="stylesheet" href="css/animate.min.css">
        <!-- Bootstrap CSS -->
        <link rel="stylesheet" href="css/bootstrap.min.css">
        <!-- Slicknav CSS -->
        <link rel="stylesheet" href="css/slicknav.min.css">
        <!--Slick Slider-->
        <link rel="stylesheet" href="css/slick.css">
        <!--Slider CSS-->
        <link rel="stylesheet" href="css/slider.css">
        <!-- Venobox CSS -->
        <link rel="stylesheet" href="css/venobox/venobox.css">
        <!-- OWL-Carousel CSS -->
        <link rel="stylesheet" href="css/owl.carousel.min.css">
        <!-- Main CSS -->
        <link rel="stylesheet" href="css/main.css">
        <!-- Responsive CSS -->
        <link rel="stylesheet" href="css/responsive.css">

        <script src="js/vendor/modernizr-2.8.3-respond-1.4.2.min.js"></script>
    </head>
    <body data-spy="scroll" data-target="#navmenu" data-offset="70">
        <!--[if lt IE 8]>
            <p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
        <![endif]-->
        
        <div class="site-preloader-wrap">
            <div class="spinner"></div>
        </div><!-- Preloader -->
        
        <header id="header" class="header-section">
            <div class="container">
                <nav class="navbar ">
                    <a href="index.html" class="navbar-brand">
                        <img class="logo-dark" src="img/logo-dark.png" alt="Saasbiz">
                    </a>
                    <div class="d-flex menu-wrap">
                       <div id="mainmenu" class="mainmenu">
                           <ul class="nav">
                               <li><a data-scroll class="nav-link active" href="index.html">Home<span class="sr-only">(current)</span></a> 
                                </li>
                                <li><a href="about.html">About Us</a></li>
                                <li><a href="services.html">Services</a></li>
                                <li><a href="shop.html">Shop</a> 
                                    <ul>
                                       <li><a href="shop.html">Shop Page</a></li>
                                       <li><a href="product-details.html">Product Details</a></li>
                                    </ul>
                                </li>
                                <li><a href="#">Pages</a> 
                                    <ul>
                                       <li><a href="gallery.html">Gallery</a></li>
                                       <li><a href="team.html">Our Team</a></li>
                                       <li><a href="testimonial.html">Testimonial</a></li>
                                       <li><a href="faq.html">FAQ's</a></li>
                                       <li><a href="404.html">404 Error</a></li>
                                    </ul>
                                </li>
                                <li><a href="#">Blog</a> 
                                    <ul>
                                       <li><a href="blog-grid.html">Blog Grid</a></li>
                                       <li><a href="blog-classic.html">Blog Classic</a></li>
                                       <li><a href="blog-single.html">Blog Single</a></li>
                                    </ul>
                                </li>
                                <li><a href="contact.html">Contact</a></li>
                            </ul>
                       </div>
                        <div class="header-right">
                             <a class="menu-btn btn-white" href="#">Get Started</a>
                        </div>
                    </div>
                </nav>
            </div>
        </header> <!--.header-section -->
        
        <div class="header-height"></div>

        <div id="main-slider" class="dl-slider">
            
        </div><!--/.slider-section-->
        
        <section class="promo-section padding bg-grey pos-rel">
           <div class="food-1"></div>
           <div class="food-2"></div>
            
        </section><!--/.promo-section-->
        
        <section class="about-section padding">
            
        </section><!--/.about-section-->
        
        <section class="product-carousel-section bg-grey padding">
            
        </section><!--/.product-carousel-section-->
        
        <section class="feature-section padding">
            
        </section><!--/.feature-section-->
        
        <section class="product-section padding bg-grey">
            
        </section><!--/.product-section-->
        
        <section class="cta-section padding">
            
        </section><!--/.cta-section-->
        
        <section class="team-section padding bg-grey">
            
        </section><!--/.team-section-->
        
        <section class="gallery-section padding">
            
        </section><!--/.gallery-section-->
        
        <section class="testimonial-section bg-grey padding">
            
        </section><!--/.testimonial-section-->
        
        <section class="faq-section padding">
            
        </section><!--/.faq-section-->
        
        <section class="blog-section bg-grey padding">
            
        </section><!--/.blog-section-->
        
        <div class="sponsor-section">
            
        </div><!--/.sponsor-section-->
        
        <footer class="widget-section">
           <div class="widget-wrap padding">
               
            </div>
            <div class="footer-section align-center">
                <div class="container">
                    <p>© 2020 OrganZe Powered by teamXcel</p>
                </div>
            </div><!-- /.footer-section -->
        </footer><!--/.widget-section-->

        <a data-scroll href="#header" id="scroll-to-top"><i class="ti-arrow-up"></i></a>
    
        <!-- jQuery Lib -->
        <script src="js/vendor/jquery-1.12.4.min.js"></script>
        <script src="js/vendor/bootstrap.min.js"></script>
        <script src="js/vendor/tether.min.js"></script>
        <script src="js/vendor/jquery.slicknav.min.js"></script>
        <script src="js/vendor/owl.carousel.min.js"></script>
        <script src="js/vendor/smooth-scroll.min.js"></script>
        <script src="js/vendor/jquery.isotope.v3.0.2.js"></script>
        <script src="js/vendor/imagesloaded.pkgd.min.js"></script>
        <script src="js/vendor/venobox.min.js"></script>
        <script src="js/vendor/jquery.ajaxchimp.min.js"></script>
        <script src="js/vendor/slick.min.js"></script>
        <script src="js/vendor/wow.min.js"></script>
        <script src="js/main.js"></script>

    </body>
</html>
        

B) Template Components - top

The site is made of many sections like header, slider, testimonials, services and more...

1) Header Section - top

<header id="header" class="header-section">
    <div class="container">
        <nav class="navbar ">
            <a href="index.html" class="navbar-brand">
                <img class="logo-dark" src="img/logo-dark.png" alt="Saasbiz">
            </a>
            <div class="d-flex menu-wrap">
               <div id="mainmenu" class="mainmenu">
                   <ul class="nav">
                       <li><a data-scroll class="nav-link active" href="index.html">Home<span class="sr-only">(current)</span></a> 
                        </li>
                        <li><a href="about.html">About Us</a></li>
                        <li><a href="services.html">Services</a></li>
                        <li><a href="shop.html">Shop</a> 
                            <ul>
                               <li><a href="shop.html">Shop Page</a></li>
                               <li><a href="product-details.html">Product Details</a></li>
                            </ul>
                        </li>
                        <li><a href="#">Pages</a> 
                            <ul>
                               <li><a href="gallery.html">Gallery</a></li>
                               <li><a href="team.html">Our Team</a></li>
                               <li><a href="testimonial.html">Testimonial</a></li>
                               <li><a href="faq.html">FAQ's</a></li>
                               <li><a href="404.html">404 Error</a></li>
                            </ul>
                        </li>
                        <li><a href="#">Blog</a> 
                            <ul>
                               <li><a href="blog-grid.html">Blog Grid</a></li>
                               <li><a href="blog-classic.html">Blog Classic</a></li>
                               <li><a href="blog-single.html">Blog Single</a></li>
                            </ul>
                        </li>
                        <li><a href="contact.html">Contact</a></li>
                    </ul>
               </div>
                <div class="header-right">
                     <a class="menu-btn btn-white" href="#">Get Started</a>
                </div>
            </div>
        </nav>
    </div>
</header> <!--.header-section -->

<div class="header-height"></div>

2) Slider Section - top


<div id="main-slider" class="dl-slider">
    <div class="single-slide">
        <div class="bg-img" style="background-image: url(img/slider1.jpg);"></div>
        <div class="slider-content-wrap d-flex align-items-center text-left">
            <div class="container">
                <div class="slider-content">
                    <div class="dl-caption medium"><div class="inner-layer"><div data-animation="fade-in-right" data-delay="1s">Extra 50% off for all winter foods.</div></div></div>
                    <div class="dl-caption big"><div class="inner-layer"><div data-animation="fade-in-left" data-delay="2s">Live With Organic </div></div>
                    </div>
                    <div class="dl-caption big"><div class="inner-layer"><div data-animation="fade-in-left" data-delay="2.5s">foods Live Healthily.</div></div></div>
                    <div class="dl-caption small"><div class="inner-layer"><div data-animation="fade-in-left" data-delay="3s">Your journey to a healthier life starts here.</div></div></div>
                    <div class="dl-btn-group">
                        <div class="inner-layer">
                            <a href="#" class="dl-btn" data-animation="fade-in-left" data-delay="3.5s">View Product <i class="arrow_right"></i></a>
                        </div>
                    </div>
                </div>
            </div>
        </div>  
    </div><!--Slide-1-->
    <div class="single-slide">
        <div class="bg-img" style="background-image: url(img/slider2.jpg);"></div>
        <div class="slider-content-wrap d-flex align-items-center text-left">
            <div class="container">
                <div class="slider-content">
                    <div class="dl-caption medium"><div class="inner-layer"><div data-animation="fade-in-right" data-delay="1s">Extra 50% off for all winter foods.</div></div></div>
                    <div class="dl-caption big"><div class="inner-layer"><div data-animation="fade-in-left" data-delay="2s">Organic food is good </div></div>
                    </div>
                    <div class="dl-caption big"><div class="inner-layer"><div data-animation="fade-in-left" data-delay="2.5s">for health.</div></div></div>
                    <div class="dl-caption small"><div class="inner-layer"><div data-animation="fade-in-left" data-delay="3s">Get fresh food from our table to your table.</div></div></div>
                    <div class="dl-btn-group">
                        <div class="inner-layer">
                            <a href="#" class="dl-btn" data-animation="fade-in-left" data-delay="3.5s">View Product <i class="arrow_right"></i></a>
                        </div>
                    </div>
                </div>
            </div>
        </div>  
    </div><!--Slide-2-->
</div><!--/.slider-section-->

3) Promo Section - top


<section class="promo-section padding bg-grey pos-rel">
   <div class="food-1"></div>
   <div class="food-2"></div>
    <div class="container">
        <div class="promo-wrap row">
            <div class="col-md-4 col-sm-6 xs-padding">
                <div class="promo-item text-center">
                    <i class="food-icon food-iconolives"></i>
                    <h3>Natural Food</h3>
                    <p>Organic food is food produced by methods that comply with the standards of farming.</p>
                    <a href="#">Read More</a>
                </div>
            </div>
            <div class="col-md-4 col-sm-6 xs-padding">
                <div class="promo-item active text-center">
                    <i class="food-icon food-iconcauliflower"></i>
                    <h3>Biologically Safe</h3>
                    <p>Organic food is food produced by methods that comply with the standards of farming.</p>
                    <a href="#">Read More</a>
                </div>
            </div>
            <div class="col-md-4 col-sm-6 xs-padding">
                <div class="promo-item text-center">
                    <i class="food-icon food-iconwatermelon"></i>
                    <h3>Conser Diversity</h3>
                    <p>Organic food is food produced by methods that comply with the standards of farming.</p>
                    <a href="#">Read More</a>
                </div>
            </div>
        </div>
    </div>
</section><!--/.promo-section-->


4) About Section - top


<section class="about-section padding">
    <div class="container">
        <div class="about-wrap row">
            <div class="col-md-6 xs-padding">
                <div class="about-content">
                   <div class="section-heading">
                        <img src="img/title-border.png" alt="img">
                        <h2>We Provide Good Food <br>For Your Family!</h2>
                        <p>Organic food is food produced by methods that comply with the standards of organic farming. Standards vary worldwide, but organic farming features practices that cycle resources.</p>
                   </div>
                    <ul class="about-info">
                        <li><i class="ti-hand-point-right"></i>Premium Quality</li>
                        <li><i class="ti-hand-point-right"></i>Harvest Everyday</li>
                        <li><i class="ti-hand-point-right"></i>100% Organic</li>
                        <li><i class="ti-hand-point-right"></i>Fast Delivery</li>
                    </ul>
                    <a class="default-btn" href="#">Browse Our Foods<span></span></a>
                </div>
            </div>
            <div class="col-md-6 xs-padding">
                <div class="about-img">
                    <img src="img/about-1.png" alt="img">
                </div>
            </div>
        </div>
    </div>
</section><!--/.about-section-->


5) Product Carousel Section - top


<section class="product-carousel-section bg-grey padding">
    <div class="container">
       <div class="section-heading mb-40 text-center">
           <img src="img/title-border.png" alt="img">
           <h2>Featured Product</h2>
           <p>Organic food is food produced by methods that comply with the standards <br>of organic farming. Standards vary worldwide.</p>
       </div>
        <div id="product-carousel" class="product-carousel owl-carousel">
            <div class="product-item">
                <div class="product-thumb">
                    <img src="img/product-1.jpg" alt="img">
                    <ul class="product-btn-group">
                        <li><a href="#"><i class="ti-shopping-cart-full"></i></a></li>
                        <li><a href="#"><i class="ti-gallery"></i></a></li>
                        <li><a href="#"><i class="ti-heart"></i></a></li>
                    </ul>
                </div>
                <div class="product-content text-center">
                    <h3>Cheese butter burger</h3>
                    <h4><span>$72.28</span><span class="old">$95.50</span></h4>
                </div>
            </div>
        </div>
    </div>
</section><!--/.product-carousel-section-->


6) Features Section - top


<section class="feature-section padding">
    <div class="container">
        <div class="feature-wrap row">
            <div class="col-lg-6 sm-padding">
                <div class="feature-info">
                   <div class="section-heading">
                       <img src="img/title-border.png" alt="img">
                        <h2>The Best Trusted <br>Farms For You</h2>
                        <p>Organic food is food produced by methods that comply with the standards of organic farming. Standards vary worldwide, but organic farming features practices that cycle resources.</p>
                   </div>
                    <ul class="feature-list">
                        <li>
                            <i class="fa fa-check"></i>
                            <div class="feature-content"><h3>Natural Process</h3>
                            <p>Organic food is food produced by methods that comply with the standards of organic farming.</p>
                            </div>
                        </li>
                        <li>
                            <i class="fa fa-check"></i>
                            <div class="feature-content"><h3>Homegrown Goodness</h3>
                            <p>Organic food is food produced by methods that comply with the standards of organic farming.</p>
                            </div>
                        </li>
                        <li>
                            <i class="fa fa-check"></i>
                            <div class="feature-content"><h3>Organic Products</h3>
                            <p>Organic food is food produced by methods that comply with the standards of organic farming.</p>
                            </div>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="col-lg-6 sm-padding">
                <div class="feature-img">
                    <img src="img/feature-1.jpg" alt="img">
                </div>
            </div>
        </div>
    </div>
</section><!--/.feature-section-->


7) Product Section - top


<section class="product-section padding bg-grey">
    <div class="container">
       <div class="section-heading mb-40 text-center">
           <img src="img/title-border.png" alt="img">
           <h2>Our Products</h2>
           <p>Organic food is food produced by methods that comply with the standards <br>of organic farming. Standards vary worldwide.</p>
       </div>
       <div class="row">
           <div class="col-lg-12">
               <ul class="product-filter text-center">
                    <li class="active" data-filter="*">All</li>
                    <li data-filter=".food">Food</li>
                    <li data-filter=".fruits">Fruits</li>
                    <li data-filter=".vegitable">Vegitable</li>
                    <li data-filter=".juice">Juice</li>
                </ul>
           </div>
       </div>
        <div class="product-items row">
            <div class="col-lg-3 col-sm-6 padding-15 single-item food juice">
                <div class="product-item">
                    <div class="product-thumb">
                        <img src="img/product-1.jpg" alt="img">
                        <ul class="product-btn-group">
                            <li><a href="#"><i class="ti-shopping-cart-full"></i></a></li>
                            <li><a href="#"><i class="ti-gallery"></i></a></li>
                            <li><a href="#"><i class="ti-heart"></i></a></li>
                        </ul>
                    </div>
                    <div class="product-content text-center">
                        <h3>Cheese butter burger</h3>
                        <h4><span>$72.28</span><span class="old">$95.50</span></h4>
                    </div>
                </div>
            </div>
            <div class="col-lg-3 col-sm-6 padding-15 single-item fruits vegitable">
                <div class="product-item">
                    <div class="product-thumb">
                        <img src="img/product-2.jpg" alt="img">
                        <ul class="product-btn-group">
                            <li><a href="#"><i class="ti-shopping-cart-full"></i></a></li>
                            <li><a href="#"><i class="ti-gallery"></i></a></li>
                            <li><a href="#"><i class="ti-heart"></i></a></li>
                        </ul>
                    </div>
                    <div class="product-content text-center">
                        <h3>Fresh Orange</h3>
                        <h4><span>$67.28</span><span class="old">$82.50</span></h4>
                    </div>
                </div>
            </div>
            <div class="col-lg-3 col-sm-6 padding-15 single-item vegitable juice">
                <div class="product-item">
                    <div class="product-thumb">
                        <img src="img/product-3.jpg" alt="img">
                        <ul class="product-btn-group">
                            <li><a href="#"><i class="ti-shopping-cart-full"></i></a></li>
                            <li><a href="#"><i class="ti-gallery"></i></a></li>
                            <li><a href="#"><i class="ti-heart"></i></a></li>
                        </ul>
                    </div>
                    <div class="product-content text-center">
                        <h3>Fresh Grapes</h3>
                        <h4><span>$75.28</span><span class="old">$89.50</span></h4>
                    </div>
                </div>
            </div>
            <div class="col-lg-3 col-sm-6 padding-15 single-item juice fruits">
                <div class="product-item">
                    <div class="product-thumb">
                        <img src="img/product-4.jpg" alt="img">
                        <ul class="product-btn-group">
                            <li><a href="#"><i class="ti-shopping-cart-full"></i></a></li>
                            <li><a href="#"><i class="ti-gallery"></i></a></li>
                            <li><a href="#"><i class="ti-heart"></i></a></li>
                        </ul>
                    </div>
                    <div class="product-content text-center">
                        <h3>Impulse Duffle</h3>
                        <h4><span>$45.28</span><span class="old">$70.50</span></h4>
                    </div>
                </div>
            </div>
            <div class="col-lg-3 col-sm-6 padding-15 single-item fruits juice">
                <div class="product-item">
                    <div class="product-thumb">
                        <img src="img/product-5.jpg" alt="img">
                        <ul class="product-btn-group">
                            <li><a href="#"><i class="ti-shopping-cart-full"></i></a></li>
                            <li><a href="#"><i class="ti-gallery"></i></a></li>
                            <li><a href="#"><i class="ti-heart"></i></a></li>
                        </ul>
                    </div>
                    <div class="product-content text-center">
                        <h3>Fresh Tomatos</h3>
                        <h4><span>$65.28</span><span class="old">$78.50</span></h4>
                    </div>
                </div>
            </div>
            <div class="col-lg-3 col-sm-6 padding-15 single-item vegitable fruits">
                <div class="product-item">
                    <div class="product-thumb">
                        <img src="img/product-6.jpg" alt="img">
                        <ul class="product-btn-group">
                            <li><a href="#"><i class="ti-shopping-cart-full"></i></a></li>
                            <li><a href="#"><i class="ti-gallery"></i></a></li>
                            <li><a href="#"><i class="ti-heart"></i></a></li>
                        </ul>
                    </div>
                    <div class="product-content text-center">
                        <h3>Cheese butter</h3>
                        <h4><span>$48.28</span><span class="old">$65.50</span></h4>
                    </div>
                </div>
            </div>
            <div class="col-lg-3 col-sm-6 padding-15 single-item fruits food">
                <div class="product-item">
                    <div class="product-thumb">
                        <img src="img/product-7.jpg" alt="img">
                        <ul class="product-btn-group">
                            <li><a href="#"><i class="ti-shopping-cart-full"></i></a></li>
                            <li><a href="#"><i class="ti-gallery"></i></a></li>
                            <li><a href="#"><i class="ti-heart"></i></a></li>
                        </ul>
                    </div>
                    <div class="product-content text-center">
                        <h3>Fresh Onion</h3>
                        <h4><span>$30.28</span><span class="old">$45.50</span></h4>
                    </div>
                </div>
            </div>
            <div class="col-lg-3 col-sm-6 padding-15 single-item food vagitable">
                <div class="product-item">
                    <div class="product-thumb">
                        <img src="img/product-8.jpg" alt="img">
                        <ul class="product-btn-group">
                            <li><a href="#"><i class="ti-shopping-cart-full"></i></a></li>
                            <li><a href="#"><i class="ti-gallery"></i></a></li>
                            <li><a href="#"><i class="ti-heart"></i></a></li>
                        </ul>
                    </div>
                    <div class="product-content text-center">
                        <h3>Fresh Butter</h3>
                        <h4><span>$44.28</span><span class="old">$66.50</span></h4>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section><!--/.product-section-->


8) Cta Section - top


<section class="cta-section padding">
    <div class="container">
        <div class="cta-wrap row">
            <div class="col-lg-8 sm-padding">
                <div class="cta-content">
                    <h2>We are Professional & Expert <br>Trusted Organic Agency!</h2>
                    <p>Organic food is food produced by methods that comply with the standards of organic farming. Standards vary worldwide, but organic farming features practices that cycle resources.</p>
                </div>
            </div>
            <div class="col-lg-4 sm-padding">
                <div class="cta-btn text-right">
                    <a class="default-btn" href="#">Visit Our Store<span></span></a>
                </div>
            </div>
        </div>
    </div>
</section><!--/.cta-section-->

9) Team Section - top


<section class="team-section padding bg-grey">
    <div class="container">
        <div class="section-heading mb-40 text-center">
            <img src="img/title-border.png" alt="img">
            <h2>Our Farmers</h2>
            <p>Organic food is food produced by methods that comply with the standards <br>of organic farming. Standards vary worldwide.</p>
        </div>
        <div class="team-wrap row">
            <div class="col-lg-3 col-sm-6 padding-15">
                <div class="team-box">
                    <div class="team-item">
                        <img src="img/team1.jpg" alt="img">
                        <ul class="team-social">
                            <li><a href="#"><i class="fab fa-facebook"></i></a></li>
                            <li><a href="#"><i class="fab fa-instagram"></i></a></li>
                            <li><a href="#"><i class="fab fa-behance"></i></a></li>
                            <li><a href="#"><i class="fab fa-twitter"></i></a></li>
                        </ul>
                    </div>
                    <div class="team-content text-center">
                        <h3>José Carpio<span>Organic Farmers</span></h3>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section><!--/.team-section-->

10) Gallery Section - top


<section class="gallery-section padding">
    <div class="container">
       <div class="section-heading mb-40 text-center">
           <img src="img/title-border.png" alt="img">
           <h2>Organze Food Gallery</h2>
           <p>Organic food is food produced by methods that comply with the standards <br>of organic farming. Standards vary worldwide.</p>
       </div>
        <div class="gallery-wrap row">
            <div class="col-lg-4 col-sm-6 padding-15">
                <div class="gallery-item">
                    <img src="img/gallery-1.jpg" alt="img">
                    <div class="gallery-content">
                        <h3><a class="img-popup vbox-item" href="img/gallery-1.jpg">Fresh Living<span>Farming</span></a></h3>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section><!--/.gallery-section-->

11) Testimonials Section - top


<section class="testimonial-section bg-grey padding">
    <div class="container">
        <div class="section-heading mb-40 text-center">
           <img src="img/title-border.png" alt="img">
           <h2>What Our Customers Say</h2>
           <p>Organic food is food produced by methods that comply with the standards <br>of organic farming. Standards vary worldwide.</p>
        </div>
        <div id="testimonial-carousel" class="testimonial-carousel owl-carousel">
            <div class="testi-item d-flex align-items-center">
                <img src="img/testi-1.jpg" alt="img">
                <div class="testi-content">
                    <p>"Thank you for guiding us through the construction process, understanding, and always ready to accommodate our needs. We love our new space and know that it was built by the very best!"</p>
                    <h3>Kyle Frederick</h3>
                    <ul class="rattings">
                        <li><i class="fa fa-star"></i></li>
                        <li><i class="fa fa-star"></i></li>
                        <li><i class="fa fa-star"></i></li>
                        <li><i class="fa fa-star"></i></li>
                        <li><i class="fa fa-star"></i></li>
                    </ul>
                    <span>Director</span>
                </div>
                <i class="fa fa-quote-right"></i>
            </div>
        </div>
    </div>
</section><!--/.testimonial-section-->



12) FAQ Section - top


<section class="faq-section padding">
    <div class="container">
        <div class="section-heading mb-40 text-center">
           <img src="img/title-border.png" alt="img">
           <h2>Frequently Asked Questions</h2>
           <p>Organic food is food produced by methods that comply with the standards <br>of organic farming. Standards vary worldwide.</p>
        </div>
        <div class="faq-wrap row">
            <div class="col-md-6 xs-padding">
                <div class="faq-item">
                    <img src="img/faq.webp" alt="img">
                </div>
            </div>
            <div class="col-md-6 xs-padding">
                <div id="accordion" class="faq-item">
                    <div class="card">
                        <div class="card-header" id="headingOne">
                            <h5 class="mb-0">
                                <button class="btn btn-link" data-toggle="collapse" data-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
                                  What Do You Eat Orange Food?
                                </button>
                            </h5>
                        </div>
                        <div id="collapseOne" class="collapse show" aria-labelledby="headingOne" data-parent="#accordion">
                            <div class="card-body">This one is a big one that has been haunting me since teenage years. When I was in highschool. This one is a big one that has been haunting me since teenage years.
                            </div>
                        </div>
                    </div>
                    <div class="card">
                        <div class="card-header" id="headingTwo">
                            <h5 class="mb-0">
                                <button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
                                  Why Milk is Good For Health?
                                </button>
                            </h5>
                        </div>
                        <div id="collapseTwo" class="collapse" aria-labelledby="headingTwo" data-parent="#accordion">
                            <div class="card-body">This one is a big one that has been haunting me since teenage years. When I was in highschool. This one is a big one that has been haunting me since teenage years.
                            </div>
                        </div>
                    </div>
                   <div class="card">
                        <div class="card-header" id="headingThree">
                            <h5 class="mb-0">
                                <button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
                                  How Can you Get Good food?
                                </button>
                            </h5>
                        </div>
                        <div id="collapseThree" class="collapse" aria-labelledby="headingThree" data-parent="#accordion">
                            <div class="card-body">This one is a big one that has been haunting me since teenage years. When I was in highschool. This one is a big one that has been haunting me since teenage years.
                            </div>
                        </div>
                   </div>
                </div>
            </div>
        </div>
    </div>
</section><!--/.faq-section-->

13) Blog Section - top


<section class="blog-section bg-grey padding">
    <div class="container">
        <div class="section-heading mb-40 text-center">
           <img src="img/title-border.png" alt="img">
           <h2>Speciallized News</h2>
           <p>Organic food is food produced by methods that comply with the standards <br>of organic farming. Standards vary worldwide.</p>
        </div>
        <div class="row blog-wrap">
            <div class="col-lg-4 col-sm-6 sm-padding">
                <div class="blog-item">
                    <div class="blog-thumb">
                        <img src="img/post-1.jpg" alt="post">
                        <span class="category"><a href="#">interior</a></span>
                    </div>
                    <div class="blog-content">
                        <h3><a href="#">How to steam & purée your sugar pie pumkin.</a></h3>
                        <p>Building first evolved out dynamics between needs means available building materials attendant skills.</p>
                        <a href="#" class="read-more">Read More</a>
                    </div>
                </div>
            </div>
            <div class="col-lg-4 col-sm-6 sm-padding">
                <div class="blog-item">
                    <div class="blog-thumb">
                        <img src="img/post-2.jpg" alt="post">
                        <span class="category"><a href="#">Architecture</a></span>
                    </div>
                    <div class="blog-content">
                       <h3><a href="#">Great bulk recipes to help use all your organic vegetables.</a></h3>
                        <p>Building first evolved out dynamics between needs means available building materials attendant skills.</p>
                        <a href="#" class="read-more">Read More</a>
                    </div>
                </div>
            </div>
            <div class="col-lg-4 col-sm-6 sm-padding">
                <div class="blog-item">
                    <div class="blog-thumb">
                        <img src="img/post-3.jpg" alt="post">
                        <span class="category"><a href="#">Design</a></span>
                    </div>
                    <div class="blog-content">
                        <h3><a href="#">How can salmon be raised organically in fish farms?</a></h3>
                        <p>Building first evolved out dynamics between needs means available building materials attendant skills.</p>
                        <a href="#" class="read-more">Read More</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section><!--/.blog-section-->


14) Sponsor Section - top


;div class="sponsor-section">
    <div class="container">
        <div id="sponsor-carousel" class="sponsor-carousel owl-carousel">
            <div class="sponsor-item">
                <img src="img/sponsor1.png" alt="sponsor">
            </div>
            <div class="sponsor-item">
                <img src="img/sponsor2.png" alt="sponsor">
            </div>
            <div class="sponsor-item">
                <img src="img/sponsor3.png" alt="sponsor">
            </div>
            <div class="sponsor-item">
                <img src="img/sponsor4.png" alt="sponsor">
            </div>
            <div class="sponsor-item">
                <img src="img/sponsor5.png" alt="sponsor">
            </div>
            <div class="sponsor-item">
                <img src="img/sponsor6.png" alt="sponsor">
            </div>
            <div class="sponsor-item">
                <img src="img/sponsor7.png" alt="sponsor">
            </div>
            <div class="sponsor-item">
                <img src="img/sponsor8.png" alt="sponsor">
            </div>
        </div>
    </div>
</div><!--/.sponsor-section-->


15) Footer Section - top


<<footer class="widget-section">
   <div class="widget-wrap padding">
       <div class="container">
            <div class="row">
                <div class="col-lg-3 col-sm-6 sm-padding">
                    <div class="widget-content">
                        <a href="#"><img src="img/logo-light.png" alt="brand"></a>
                        <p>Building your own home is about desire, fantasy. But it’s achievable anyone can do it.</p>
                    </div>
                </div>
                <div class="col-lg-2 col-sm-6 sm-padding">
                    <div class="widget-content footer">
                        <h4>Company</h4>
                        <ul class="widget-links">
                            <li><a href="#">About Us</a></li>
                            <li><a href="#">Our Services</a></li>
                            <li><a href="#">Clients Reviews</a></li>
                            <li><a href="#">Contact Us</a></li>
                        </ul>
                    </div>
                </div>
                <div class="col-lg-3 col-sm-6 sm-padding">
                    <div class="widget-content footer">
                        <h4>Headquaters</h4>
                        <p>962 Fifth Avenue, 3rd Floor New York, NY10022</p>
                        <span>Hello@teamXcel.net</span>
                        <span>(+123) 456 789 101</span>
                    </div>
                </div>
                <div class="col-lg-4 col-sm-6 sm-padding">
                    <div class="widget-content footer">
                        <h4>Newslatter Subscription</h4>
                        <p>Subscribe and get 10% off from our <br>architecture company.</p>
                        <div class="subscribe-box clearfix">
                            <div class="subscribe-form-wrap">
                                <form action="#" class="subscribe-form">
                                    <input type="email" name="email" id="subs-email" class="form-input" placeholder="Enter Your Email Address...">
                                    <button type="submit" class="submit-btn">Subscribe</button>
                                    <div id="subscribe-result">
                                        <p class="subscription-success"></p>
                                        <p class="subscription-error"></p>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="footer-section align-center">
        <div class="container">
            <p>© 2020 OrganZe Powered by teamXcel</p>
        </div>
    </div><!-- /.footer-section -->
</footer><!--/.widget-section-->


 


C) CSS Files and Structure - top

These are the css files:

  1. bootstrap.min.css
  2. animate.min.css
  3. elegant-font-icons.css
  4. elegant-line-icons.css
  5. owl.carousel.css
  6. main.css
  7. responsive.css

 


D) JavaScript - top

This theme use these Javascript files:

  1. jQuery
    jQuery is a Javascript library that greatly reduces the amount of code that you must write. jQuery use these javascript files:
                	bootstrap.min.js
                    smooth-scroll.min.js
                    owl.carousel.min.js
                    jquery.ajaxchimp.min.js
                    jquery-1.12.4.min.js
                    jquery.mb.YTPlayer.min.js
                    owl.carousel.min.js
                    venobox.min.js
                    wow.min.js
                    jquery.counterup.min.js
                    main.js
                
    You can edit the contact.js files. for setting contact form


F) Sources and Credits - top

  1. Bootstrap 3.3
  2. OWL Carousel
  3. WOW JS
  4. VenoBox
  5. Smooth Scroll
  6. YTPlayer
  7. AjaxChimp


G) PHP Code Explanation - top

There are only one php code for contact page which is contact.php, open this file and change the email and subject on line 24 and line 27. No need to edit other code unless you really want to.


Once again, thank you so much for purchasing this theme. As I said at the beginning, I'd be glad to help you if you have any questions relating to this theme. No guarantees, but I'll do my best to assist.

ThemeEaster

Go To Table of Contents